import type {
  BlogThemeService,
  OthersThemeService,
  SearchThemeService,
  TieBarThemeService,
  VideoThemeService,
} from '../../lib/abstract'
import type {
  DOMSelectorMap,
  HeadingLevel,
  HeadingTag,
  IHeadingStyle,
} from '../interfaces'
import { SYMBOLS } from '../interfaces'
import { TITLE_STYLES } from './styles/title'

/**
 * 项目前缀
 */
export const PROJECT_PREFIX: string = 'green-web'

/**
 * 主题变量名称
 */
export const THEME_VAR: string = `--${PROJECT_PREFIX}-active-theme`

/**
 * 标题标签
 */
export const HEADING_TAG: string = 'h1, h2, h3, h4, h5, h6'
export const HEADING_TAG_LIST: HeadingTag[] = HEADING_TAG.split(',').map(tag => tag.trim()) as HeadingTag[]

/**
 * 开源项目托管平台类型
 */
export enum OpenSourcePlatform {
  Github = 'github',
  Gitee = 'gitee',
  Unknown = 'unknown',
}

/**
 * 登录类型
 */
export enum SignType {
  SignIn = 'sign-in',
  SignOut = 'sign-out',
}

/**
 * 主题服务类型
 */
export type ThemeService = BlogThemeService | SearchThemeService | TieBarThemeService | VideoThemeService | OthersThemeService | undefined
/**
 * app 元素选择器配置
 */
export const APP_DOM_SELECTOR_CONFIG: DOMSelectorMap = {
  // 根节点配置
  ROOT: {
    BODY: {
      selectorType: 'id',
      value: `${PROJECT_PREFIX}-app-root`,
    },
  },
  // 按钮类元素选择器
  BUTTON: {
    COPY: {
      selectorType: 'id',
      value: `${PROJECT_PREFIX}-copy-button`,
    },
  },
  // 文本容器选择器
  TEXT_CONTAINER: {
    BLOCKQUOTE: {
      selectorType: 'class',
      value: `${PROJECT_PREFIX}-fancy-quotes`,
    },
  },
}

/**
 * head 主题变量名称
 */
export const HEAD_THEME_VAR_NAME: string = `--${PROJECT_PREFIX}-theme`
/**
 * body ID
 */
export const BODY_UNIQUE_ID: string = APP_DOM_SELECTOR_CONFIG.ROOT.BODY.value
/**
 * body 选择器
 */
export const BODY_SELECTOR: string = `body#${BODY_UNIQUE_ID}`

/**
 * 元素隐藏类型
 */
export const ELEMENT_HIDE_TYPE = {
  ENGINE: 'engine',
  CUSTOM: 'custom',
}
/**
 * 元素保存配置
 */
export const ELEMENT_SAVE_SEPARATOR: string = SYMBOLS.COLOR_DIAMONDS.RED
export const ELEMENT_SAVE_CONFIG = {
  ELEMENT: {
    id: 'element',
    name: '元素',
  },
  TAG: {
    id: 'tag',
    name: '标签',
  },
}
export enum ElementConfigSource {
  Storage = 'storage',
  System = 'system',
  Custom = 'custom',
}

/**
 * 标题样式
 */
export const HEADING_STYLES: Record<HeadingLevel, IHeadingStyle> = {
  1: {
    className: TITLE_STYLES.PRIMARY.className,
  },
  2: {
    className: TITLE_STYLES.SECONDARY.className,
  },
  3: {
    className: TITLE_STYLES.TERTIARY.className,
  },
  4: {
    className: TITLE_STYLES.OTHERS.className,
  },
}

/**
 * 组件样式模式
 */
export enum ComponentStyleMode {
  Static = 'static',
  Dynamic = 'dynamic',
}

/**
 * 通用布局位置类型
 * - 用于控制元素/内容在容器中的水平位置
 */
export type LayoutPositionType = 'left' | 'center' | 'right'

/**
 * 弹性布局主轴对齐方式 (对应 justify-content 属性)
 */
export type FlexJustifyContentType = 'flex-start' | 'center' | 'flex-end'

/**
 * flex 主轴对齐的映射
 */
export const FLEX_JUSTIFY_MAP: Record<LayoutPositionType, FlexJustifyContentType> = {
  left: 'flex-start',
  center: 'center',
  right: 'flex-end',
}

/**
 * CSS 选择器语法类型枚举
 */
export enum SelectorSyntaxType {
  IS = ':is()',
  WHERE = ':where()',
  HAS = ':has()',
  NOT = ':not()',
  NTH_CHILD = ':nth-child()',
  NTH_OF_TYPE = ':nth-of-type()',
  SLOTTED = '::slotted()',
  PART = '::part()',
  HOST = ':host()',
  HOST_CONTEXT = ':host-context()',
}

export const RATING_BACKGROUND_COLORS = {
  good: { name: '好评', color: 'linear-gradient(135deg, #4CAF50, #8BC34A)' },
  ok: { name: '一般', color: 'linear-gradient(135deg, #FFEB3B, #FDD835)' },
  bad: { name: '差评', color: 'linear-gradient(135deg, #F44336, #E57373)' },
  neutral: { name: '中立', color: 'linear-gradient(135deg, #607D8B, #9E9E9E)' },
  none: { name: '无评价', color: 'linear-gradient(135deg, #607D8B, #9E9E9E)' },
}

/**
 * 从标签配置中获取颜色配置
 * @param color 颜色值
 * @param defaultColor 默认颜色
 * @returns ECharts颜色配置
 */
export function getChartLabelColor(color: string, defaultColor: string = '#5470C6'): any {
  if (!color) {
    return defaultColor
  }

  // 处理渐变颜色
  if (color.startsWith('linear-gradient')) {
    // 支持两种格式：
    // 1. linear-gradient(135deg, #00B0FF, #40C4FF)
    // 2. linear-gradient(135deg, #00B0FF 0%, #40C4FF 100%)
    const gradientRegex = /^linear-gradient\((\d+)deg,\s*([^,\s]+)(?:\s+(\d+%))?,\s*([^,\s]+)(?:\s+(\d+%))?\)$/
    const matches = color.match(gradientRegex)

    if (matches) {
      const [_, angleStr, color1, offset1Str, color2, offset2Str] = matches
      const angle = Number.parseInt(angleStr)

      // 计算渐变方向向量
      const radian = (angle * Math.PI) / 180
      const x = Math.sin(radian)
      const y = Math.cos(radian)

      return {
        type: 'linear',
        x: 0,
        y: 0,
        x2: x,
        y2: y,
        colorStops: [
          {
            offset: offset1Str ? Number.parseFloat(offset1Str) / 100 : 0,
            color: color1.trim(),
          },
          {
            offset: offset2Str ? Number.parseFloat(offset2Str) / 100 : 1,
            color: color2.trim(),
          },
        ],
        global: false,
      }
    }
  }

  // 返回纯色
  return color
}
